import React, { useEffect,useState } from "react";
import { Button, Modal, Form, Input, Radio, DatePicker } from "antd";
import { update } from '../../../services/coupon';
import { useDispatch, useSelector } from "react-redux";
import { setUpdateVisible } from "../../../store/slice/couponSlice";
const { RangePicker } = DatePicker;
export default function Update(props) {

    const [form] = Form.useForm();
    let updateVisible = useSelector(state => state.coupon.updateVisible);
    let coupon = useSelector(state => state.coupon.coupon);
    let [time, setTime] = useState();
    let dispatch = useDispatch();
    const handleOk = async () => {
        await update({ _id: coupon._id, ...form.getFieldsValue(),date:time});
        props.show();

        dispatch(setUpdateVisible(false));
    };
    // 日期
    const cou = (_,value) => {
        value = value.join('/');
        setTime(value);
    }

    const handleCancel = () => {

        dispatch(setUpdateVisible(false));
    };

    useEffect(() => {
       
        form.setFieldsValue(coupon);


    }, [coupon._id]);
    return (
        <div>
            <Modal
                title="修改"
                forceRender={true}
                open={updateVisible}
                onOk={handleOk}
                onCancel={handleCancel}
            >
                <Form
                    form={form}
                    name="addForm"
                    labelCol={{ span: 4 }}
                    wrapperCol={{ span: 20 }}
                    autoComplete="off"
                >
                    <Form.Item
                        label="优惠券名称"
                        name="name"
                        rules={[
                            {
                                required: true,
                                message: "请输入",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="活动"
                        name="coupons"
                        rules={[
                            {
                                required: true,
                                message: "请输入 ",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="折扣"
                        name="func"
                        rules={[
                            {
                                required: true,
                                message: "请输入",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="日期"
                        name="date"
                    
                    >
                        <RangePicker  onChange={cou} />
                       <input style={{display:"none"}} />
                    </Form.Item>
                    <Form.Item
                        label="规则"
                        name="intro"
                        rules={[
                            {
                                required: true,
                                message: "请输入",
                            },
                        ]}
                    >
                        <Input />
                    </Form.Item>


                </Form>
            </Modal>
        </div>
    );
}
